<template>
	<view>
		<scroll-view style="height: 100vh;" scroll-y="true"	
			@scrolltolower="scrolltolower"
			>
			<view class="share-content">
				<view class="wrap">
					<ListItem v-for="item in list" 
					:key="item.id" :itemData="item"></ListItem>
				</view>	
			</view>
		</scroll-view>
		<!-- 功能小球 -->
		<view class="add-btn" v-if="isLogin" @click="toAddGoods">
			寄售
		</view>
	</view>
</template>

<script>
	import ListItem from "./components/list-item.vue"
	import {queryGoodsListApi} from "@/http/goods.js"
	import { getItem } from "@/utils/selfLocalStorage.js"
	
	// 防抖定时器
	let Time = null;
	
	export default {
		name: "share",
		data() {
			return {
				triggered: false,
				isLogin:false,
				goodsQuery:{
					page:0,
					pageSize:3,
					categoryUd:null,
					sellerId:null
				},
				total:0,
				list: []
			}
		},
		components: {
			ListItem
		},
		onLoad() {
			this.queryGoodsList();
		},
		onShow() {
			// 查看是否登录
			if( getItem("uid") ){
				this.isLogin = true;
			}else{
				this.isLogin = false;
			}
		},
		methods: {
			// 查询数据
			async queryGoodsList(){
				const res = await queryGoodsListApi(this.goodsQuery);
				this.total = res.total;
				this.list = res.records;
			},
			
			toAddGoods() {
				uni.navigateTo({
					url: "/pages/share/addGoods"
				})
			},
			// 触底
			scrolltolower(){
				// 
				
				if(this.total <= this.goodsQuery.page + this.goodsQuery.pageSize) return
				// 防抖
			   if(Time) return;
			   Time = setTimeout(async ()=>{
				   this.goodsQuery.page = this.goodsQuery.pageSize + this.goodsQuery.page;
				   const {records} = await queryGoodsListApi(this.goodsQuery);
				   this.list = [...this.list,...records];
				   Time = null
			   }, 500)
			},
			
			// 下拉刷新
			onPulling(e) {
				console.log("onpulling", e);
			},
			onRefresh() {
				if (this._freshing) return;
				this._freshing = true;
				setTimeout(() => {
					this.triggered = false;
					this._freshing = false;
				}, 1000)
			},
			onRestore() {
				this.triggered = 'restore'; // 需要重置
				console.log("onRestore");
			},
			onAbort() {
				console.log("onAbort");
			}
		}
	}
</script>

<style lang="less" scoped>
	.share-content {
		padding-top: 20rpx;
		background-color: #fbf9ec;

		.wrap {
			padding: 0 15rpx;
		}
	}
.add-btn {
			position: fixed;
			right: 8vw;
			bottom: 8vh;
			width: 100rpx;
			height: 100rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 36rpx;
			color: #fbf9ec;
			background-color: #5ca45b;
			border-radius: 50rpx;
			z-index: 1000;
		}
 .mone{
	 display: none;
 }
</style>